<template>
	<view>
		<view class="">
			<view v-if="newFriends.length==0" style="text-align: center; margin-top: 10px;">
				暂无新朋友请求
			</view>

			<view v-for="(item,index) in newFriends">
				<view class="friendList">
					<u-avatar :src="item.image" size="16vw"></u-avatar>
					<view class="userInfoBox">
						<view class="userName">
							{{item.name}}
						</view>
						<view class="content">
							{{JSON.parse(item.content).content}}
						</view>
					</view>
				</view>

				<view class="detail" v-if="item.agree==0">
					<view class="send" @click="notAgree(item.userId,index)" style="background-color: red;">
						拒绝
					</view>
					<view class="send" @click="agree(item.userId,index)" style="background-color: #41A863;">
						同意
					</view>
				</view>

				<view class="detail">
					<view class="send" style="width: 90vw;background-color: #41A863;" v-if="item.agree==1">
						已同意
					</view>
					<view class="send" style="width: 90vw;background-color: red;" v-if="item.agree==2">
						已拒绝
					</view>
				</view>
			</view>
		</view>
	</view>


	</view>
</template>

<script>
	import {
		socket
	} from '../../../utils/socket.js';
	export default {
		data() {
			return {
				newFriends: []
			};
		},
		onLoad(e) {
			this.getNewFriend()
		},
		methods: {
			getNewFriend() {
				uni.request({
					url: getApp().url + 'friendList/getReqFriendList',
					data: {
						userId: uni.getStorageSync("userId")
					},
					header: {
						token: uni.getStorageSync("token")
					},
					method: "GET",
					success: (res) => {
						this.newFriends = res.data.data
						console.log(this.newFriends)
						for (var i = 0; i < this.newFriends.length; i++) {
							this.newFriends[i]["agree"] = 0
						}
					},
					fail: (error) => {
						console.log(error);
					}
				})
			},
			notAgree(e, index) {
				this.agreeOrNot(e, "0");
				this.newFriends[index].agree = 2;
				this.$forceUpdate()
				var mark = "";
				if (uni.getStorageSync("userId") < e) {
					mark = uni.getStorageSync("userId") + "+" + e

				} else {
					mark = e + "+" + uni.getStorageSync("userId")
				}
				var message = {
					fromUserId: uni.getStorageSync("userId"),
					toUserId: e,
					type: 4,
					content: "已拒绝您的好友申请",
					mark: mark,
					enterpriseId: 0,
					createTime: Date.now()
				}
				socket.send(JSON.stringify(message))
			},
			agree(e, index) {
				this.agreeOrNot(e, "1");
				this.$forceUpdate()
				this.newFriends[index].agree = 1;
				setTimeout(() => {
					var mark = "";
					if (uni.getStorageSync("userId") < e) {
						mark = uni.getStorageSync("userId") + "+" + e

					} else {
						mark = e + "+" + uni.getStorageSync("userId")
					}
					var message = {
						fromUserId: uni.getStorageSync("userId"),
						toUserId: e,
						type: 4,
						content: "已同意您的好友申请",
						mark: mark,
						enterpriseId: 0,
						createTime: Date.now()
					}
					socket.send(JSON.stringify(message))
				}, 2000)
			},
			agreeOrNot(friendId, type) {
				uni.request({
					url: getApp().url + 'friendList/agreeOrNot',
					data: {
						userId: uni.getStorageSync("userId"),
						friendId: friendId,
						type: type
					},
					header: {
						token: uni.getStorageSync("token")
					},
					method: "GET",
					success: (res) => {
						console.log(res);
						if (type == 0) {
							uni.showToast({
								title: "已拒绝"
							})
						} else {
							uni.showToast({
								title: "已同意"
							})
						}
					},
					fail: (error) => {
						console.log(error);
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.friendList {
		display: flex;
		padding: 5px 5vw;

		.userInfoBox {
			width: 59vw;
			display: flex;
			flex-direction: column;
			justify-content: space-around;

			.userName {
				margin-left: 2vw;
			}

			.content {
				margin-left: 2vw;
				font-size: small;
				color: #A09D9D;
			}
		}
	}

	.detail {
		margin: 5px 5vw;
		height: 40px;
		display: flex;

		.send {
			width: 45vw;
			line-height: 40px;
			text-align: center;
			color: #FFF;
		}
	}
</style>